<template>
  <div>
    <svg-icon style="margin:0 12px" icon-class="clear-cache" @click="click" />
  </div>
</template>

<script>
import { clearCache } from '@/utils'
import { mapGetters } from 'vuex'
export default {
  name: 'ClearCache',
  computed: {
    ...mapGetters(['project'])
  },
  methods: {
    click() {
      clearCache()
      this.$store.dispatch('initial/getSoils', true)
      this.$store.dispatch('initial/getCrops', true)
      this.$store.dispatch('initial/getFields', true)
      this.$store.dispatch('initial/getPlantDetails', true)
      this.$store.dispatch('initial/getCropGrowthes', true)
      this.$store.dispatch('initial/getCropGrowthesStd', true)
      const params = { force: 1 }
      if (this.project) {
        params.project_id = this.project.id
      }
      this.$store.dispatch('device/getAll', params).then(res => {
        this.$message({ message: '缓存清除成功', type: 'success', showClose: true })
      })
    }
  }
}
</script>

<style scoped>
.screenfull-svg {
  display: inline-block;
  cursor: pointer;
  fill: #5a5e66;;
  width: 20px;
  height: 20px;
  vertical-align: 10px;
}
</style>
